<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>

  <input type="text"><br>
  <input type="text"><br>
  <input type="text"><br>
  <input type="text"><br>
  <input type="text"><br>
  <input type="text"><br>
  <input type="text"><br>
  <input type="text">

  <script src="js/common.js"></script>
  <script>
    var inps = document.getElementsByTagName("input");

    /**
      1. 给每个文本框绑定获取焦点事件
      2.利用排他思想，干掉全部，复活自己 
        清除所有的文本框的样式 --- 设置背景颜色为白色
        让当前文本框的样式 -- 设置背景颜色为灰色
    */
    for (var i = 0; i < inps.length; i++) {
      addEvent(inps[i], "focus", function () {
        for (var j = 0; j < inps.length; j++) {
          inps[j].style.backgroundColor = "#fff";
        }
        this.style.backgroundColor = "#ccc";
      })
    }

  </script>

</body>

</html>